/**
 * marker 图标图层
 */
// console.log(layer._ec._dom);
import sgisLayerBase from "../../sgis.layer.base";
export default {
  // 只存在一个markerLayer
  markLayer: null,
  /**
   * 创建专题图
   * @param {Object} map 地图实例
   * @param {Object} data 用于创建专题图的数据
   *      {
   *        "id": "", 专题图的id
   *        "name": "", 专题图的名称
   *        "datas": [
   *          {id:"",name:"",lon:"",lat:"",regioncode:"",regionname:""},{}
   *        ]
   *      }
   */
  addMarkers(map, data) {
    let options = {
      series: [
        {
          type: "scatter",
          coordinateSystem: "leaflet",
          symbol: "pin",
          symbolSize: 25,
          hoverAnimation: true,
          itemStyle: {
            color: "#FD255E",
            emphasis: {
              color: "#00467F"
            }
          },
          dimensions: ["lon", "lat"],
          data: data.datas
        }
      ]
    }; // 圆的大小 // 鼠标进入时的动态效果 // 颜色要动态改变 // 鼠标进入时的颜色
    let makerChart = null;
    if (this.markLayer !== null) {
      // this.markLayer.removeFrom(map);
      // this.markLayer == null;
      sgisLayerBase.removerOverLayer("markerLayer");
    }
    this.markLayer = L.supermap.echartsLayer(options);
    this.markLayer.addTo(map);
    makerChart = this.markLayer._ec;
    let popup = L.popup({
      keepInView: false,
      autoClose: false,
      autoPan: true,
      closeButton: false
    });
    makerChart.on("click", function(params) {
      // 此处查询麻点相信信息并展示
      if (params && params.data) {
        setTimeout(function() {
          popup
            .setLatLng(
              L.latLng(
                parseFloat(params.data.lat) + 0.5,
                parseFloat(params.data.lon)
              )
            )
            .setContent("此处添加查询结果弹窗") // 查询结果弹窗
            .openOn(map);
        }, 0);
      }
    });
    map.setZoom(map.getZoom()); // 此处调用一下地图缩放，但缩放等级不便，不然会出现echarts图层不刷新的情况
    let markLayerInfo = {};
    markLayerInfo.layerId = "markerLayer";
    markLayerInfo.name = "标签图层";
    markLayerInfo.layer = this.markLayer;
    sgisLayerBase.setOverLayers(markLayerInfo);
    return this.markLayer;
  },
  /**
   *
   * @param {Object} layer
   * @param {Objects} colors
   */
  setCustomColor(layer, colors) {
    // 标签专题图不能改变颜色？？
    return;
  }
};
